import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { getFeature } from 'utils/features';
import ProjectWikiContainer from '@/microModule/ProjectWikiContainer';
import { enterPage } from 'utils/track';
import UILessIframe from '@alife/uiless-extension-iframe';
import FullPage from 'components/FullPage';
import CONSTANTS from 'utils/constants';
import * as actions from '../actions/index';

const { pathResource } = window.FORCE;
class Root extends Component {
  componentDidMount() {
    enterPage('Repo-Wiki');
  }

  renderThoughts = () => {
    return (
      <FullPage>
        <div className="project-content full-width" style={{ marginBottom: 0 }}>
          <UILessIframe
            // appName={CONSTANTS.WIKI_APP_NAME}
            appIdentifier={CONSTANTS.WIKI_APP_ID}
            objectId={pathResource.id}
            objectType="Repository"
            identifier="app_for_code"
            context={{
              parentDomain: window.location.origin,
              wikiId: pathResource.id,
              role: window.FORCE.pathResource.role,
              organizationId: window.FORCE.organization.organization_id,
              userId: window.FORCE.user.id,
              objectId: pathResource.id,
              objectType: 'Repository',
              identifier: 'app_for_code',
            }}
            onChange={this.onChange}
            className="project-wiki-iframe"
          />
        </div>
      </FullPage>
    );
  };

  renderCSDN = () => {
    return (<ProjectWikiContainer />);
  };

  render() {
    return getFeature('project.wiki.provider') === 'thoughts'
      ? this.renderThoughts()
      : this.renderCSDN();
  }
}

export default connect(
  (state) => state.project.projectWiki,
  (dispatch) => bindActionCreators(actions, dispatch),
)(Root);
